{{ extend './_layout/layout.html' }} {{ block 'title' }} {{ '多人博客 - 首页'}}
{{ /block }} {{ block 'head'}}
<style>
  body {
    background: skyblue;
  }
</style>
{{ /block }} {{ block 'body' }}
<section class="container">
  <ul class="media-list">
    <li class="media">
      <div class="media-left">
        <a href="#">
          <img
            width="40"
            height="40"
            class="media-object"
            src="/public/img/FACE_10399273_20211208T110612387_143.jpg"
            alt=""
          />
        </a>
      </div>
      <div class="media-body">
        <h4 class="media-heading"><a href="/topics/123">Media heading</a></h4>
        <p>
          sueysok 回复了问题 · 2 人关注 · 1 个回复 · 187 次浏览 · 2021-12-21
          13:45:54
        </p>
      </div>
    </li>
    <li class="media">
      <div class="media-left">
        <a href="#">
          <img
            width="40"
            height="40"
            class="media-object"
            src="/public/img/FACE_10399273_20211208T110612387_143.jpg"
            alt=""
          />
        </a>
      </div>
      <div class="media-body">
        <h4 class="media-heading"><a href="/topics/123">Media heading</a></h4>
        <p>
          sueysok 回复了问题 · 2 人关注 · 1 个回复 · 187 次浏览 · 2021-12-21
          13:45:54
        </p>
      </div>
    </li>
    <li class="media">
      <div class="media-left">
        <a href="#">
          <img
            width="40"
            height="40"
            class="media-object"
            src="/public/img/FACE_10399273_20211208T110612387_143.jpg"
            alt=""
          />
        </a>
      </div>
      <div class="media-body">
        <h4 class="media-heading"><a href="/topics/123">Media heading</a></h4>
        <p>
          sueysok 回复了问题 · 2 人关注 · 1 个回复 · 187 次浏览 · 2021-12-21
          13:45:54
        </p>
      </div>
    </li>
  </ul>
  <nav aria-label="Page navigation">
    <ul class="pagination">
      <li>
        <a href="#" aria-label="Previous">
          <span aria-hidden="true">&laquo;</span>
        </a>
      </li>
      <li class="active"><a href="#">1</a></li>
      <li><a href="#">2</a></li>
      <li><a href="#">3</a></li>
      <li><a href="#">4</a></li>
      <li><a href="#">5</a></li>
      <li>
        <a href="#" aria-label="Next">
          <span aria-hidden="true">&raquo;</span>
        </a>
      </li>
    </ul>
  </nav>
</section>
{{ /block }}
<!-- script -->
{{ block 'script' }}
<script>
  // window.onload = function () {
  //   let h1 = document.querySelector('h1'),
  //     falg = false
  //   setInterval(() => {
  //     if (falg) {
  //       h1.style.background = 'green'
  //       falg = !falg
  //     } else {
  //       h1.style.background = 'skyblue'
  //       falg = !falg
  //     }
  //   }, 1000)
  // }
</script>
{{ /block }}
